<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
    xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

<ui:composition template="../template.xhtml">	
	<ui:define name="content">	   
	    <h:outputStylesheet library="css" name="richfaces.css" />
		<h1>Discounts</h1>
		<h:form>
			<div>
				<h:commandLink value="New" action="edit">
					<f:setPropertyActionListener
							target="#{discountsEditorBean.discount}" value="#{null}" />
				</h:commandLink>
			</div>		
			<rich:dataTable value="#{discountsBean.discounts}" var="discount"
				iterationStatusVar="it" id="tableDiscounts"
				rowClasses="odd-row, even-row" styleClass="stable"
				rows="#{discountsBean.rowsPerPage}">

				<!-- Telo tabulky -->
				<rich:column isortBy="#{discount.stockType.name}" id="stockType"
					sortOrder="#{discountsSortingBean.stockTypeOrder}">
					<f:facet name="header">
						<a4j:commandLink value="stockType" render="tableDiscounts" />
					</f:facet>
					<h:outputText value="#{discount.stockType.name}" />
				</rich:column>
				
				<rich:column sortBy="#{discount.time}" id="time"
					sortOrder="#{discountsSortingBean.timeOrder}">
					<f:facet name="header">
						<a4j:commandLink value="Time" render="tableDiscounts" 
						action="#{discountsSortingBean.sortByTime}" />
					</f:facet>
					<h:outputText value="#{discount.time}" />
				</rich:column>
				
				<rich:column sortBy="#{discount.discount}" id="discount"
				    sortOrder="#{discountsSortingBean.discountOrder}">
					<f:facet name="header">
						<a4j:commandLink value="Discount" render="tableDiscounts" 
						action="#{discountsSortingBean.sortByDiscount}" />
					</f:facet>
					<h:outputText value="#{discount.discount}" />
				</rich:column>
				
				<rich:column sortBy="#{discount.discountType}" id="discountType"
					sortOrder="#{discountsSortingBean.discountTypeOrder}">
					<f:facet name="header">
						<a4j:commandLink value="Discount Type" render="tableDiscounts" 
						action="#{discountsSortingBean.sortByDiscountType}" />
						</f:facet>
					<h:outputText value="#{discount.discountType}" />
				</rich:column>
				
				
				<rich:column>
					<!-- Linka na editaci zaznamu -->
					<h:commandLink value="Edit" action="edit">
					<f:setPropertyActionListener
							target="#{discountsEditorBean.discount}" value="#{discount}" />
					</h:commandLink>					
					
					<!-- Linka na Vymazanie zaznamu -->
					<a4j:commandLink execute="@this" render="confirmPane"
						oncomplete="#{rich:component('confirmPane')}.show()"
						value="Delete">
						<f:setPropertyActionListener
							target="#{discountsConfirmDeleteDialogBean.discount}" value="#{discount}" />
					</a4j:commandLink>
					
			    </rich:column>
				
				<f:facet name="footer">
					<rich:dataScroller page="#{discountsBean.page}" />
				</f:facet>
			</rich:dataTable> 
			

			<!-- JQuery na stylizaciu tabulky -->
		 	<rich:jQuery selector=".stable tr:odd" query="addClass('odd-row')" />
			<rich:jQuery selector=".stable tr:even" query="addClass('even-row')" />
			<rich:jQuery selector=".stable tr" event="mouseover"
				query="jQuery(this).addClass('active-row')" />
			<rich:jQuery selector=".stable tr" event="mouseout"
				query="jQuery(this).removeClass('active-row')" />
				
		    <!-- Potvrdzovaci dialog vymazania slevy -->
			<rich:popupPanel id="confirmPane" header="Deleting discount"
				autosized="true">
        	<h:outputText value="#{discountsConfirmDeleteDialogBean.question}" /><br />
				<a4j:commandButton value="Yes"
					action="#{discountsConfirmDeleteDialogBean.submit}" render="tableDiscounts"
					execute="confirmPane"
					oncomplete="#{rich:component('confirmPane')}.hide();" />
				<a4j:commandButton value="No"
					onclick="#{rich:component('confirmPane')}.hide(); return false;" />
			</rich:popupPanel>
		</h:form>	    
	</ui:define>
</ui:composition>
</html>